<!-- Site Setting Panel -->
  <section id="settings" data-ng-include=" 'views/settings/settings.html' " style="display:none"></section>
<!-- Site Setting Panel End -->

<!-- Page Header Start -->
<div class="pageheader">
  <h2><i class="fa fa-table"></i> Dynamic Table </h2>
  <div class="breadcrumb-wrapper hidden-xs"> <span class="label">You are here:</span>
    <ol class="breadcrumb">
      <li> <a href="index.html"> Home </a> </li>
      <li class="active"> Dynamic Table </li>
    </ol>
  </div>
</div>
<!-- Page Header End -->

<div class="page page-table"> 
  <div class="row">
    <div class="col-lg-12">
      <div class="panel panel-default">
        <div class="panel-body unseen">
          <table id="example" class="table" datatable="" cellspacing="0" width="100%">
            <thead>
              <tr>
                <th>Rec #</th>
                <th>Username</th>
                <th>Country</th>
                <th>Gender</th>
                <th>Order</th>
                <th>Date</th>
                <th>Price</th>
                <th>Status</th>
                <th>Actions</th>
              </tr>
            <tbody>
              <tr>
                <td>1</td>
                <td>Henry</td>
                <td>England</td>
                <td>Male</td>
                <td>32</td>
                <td>20-05-2014</td>
                <td>$112.40</td>
                <td><span class="label label-sm label-success">Approved</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>2</td>
                <td>Melinda</td>
                <td>Germany</td>
                <td>Female</td>
                <td>45</td>
                <td>21-09-1999</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-info">Pending</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>18</td>
                <td>Joh Doe</td>
                <td>England</td>
                <td>Male</td>
                <td>40</td>
                <td>21-09-1999</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-warning">Suspended</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>19</td>
                <td>Lahm</td>
                <td>United States</td>
                <td>Female</td>
                <td>15</td>
                <td>20-05-2014</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-danger">Blocked</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>20</td>
                <td>Henry</td>
                <td>France</td>
                <td>Male</td>
                <td>32</td>
                <td>21-09-1999</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-success">Approved</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>20</td>
                <td>Henry</td>
                <td>France</td>
                <td>Male</td>
                <td>32</td>
                <td>20-05-2014</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-success">Approved</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>20</td>
                <td>Jane</td>
                <td>England</td>
                <td>Male</td>
                <td>32</td>
                <td>21-09-2014</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-success">Approved</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>3</td>
                <td>Larry</td>
                <td>England</td>
                <td>Female</td>
                <td>40</td>
                <td>20-05-2014</td>
                <td>$112.40</td>
                <td><span class="label label-sm label-warning">Suspended</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>4</td>
                <td>Melinda</td>
                <td>United States</td>
                <td>Female</td>
                <td>15</td>
                <td>20-05-2014</td>
                <td>$123.40</td>
                <td><span class="label label-sm label-danger">Blocked</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>5</td>
                <td>Henry</td>
                <td>United States</td>
                <td>Male</td>
                <td>32</td>
                <td>21-09-1999</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-success">Approved</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>6</td>
                <td>Melinda</td>
                <td>Brazil</td>
                <td>Male</td>
                <td>32</td>
                <td>20-05-2014</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-success">Approved</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>7</td>
                <td>John</td>
                <td>England</td>
                <td>Female</td>
                <td>45</td>
                <td>21-09-1999</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-info">Pending</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>8</td>
                <td>Larry</td>
                <td>United States</td>
                <td>Female</td>
                <td>40</td>
                <td>20-05-2014</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-warning">Suspended</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>9</td>
                <td>Lahm</td>
                <td>United States</td>
                <td>Female</td>
                <td>15</td>
                <td>20-05-2014</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-danger">Blocked</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>10</td>
                <td>Melinda</td>
                <td>Germany</td>
                <td>Male</td>
                <td>32</td>
                <td>21-09-1999</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-success">Approved</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>11</td>
                <td>Henry</td>
                <td>England</td>
                <td>Male</td>
                <td>32</td>
                <td>20-05-2014</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-success">Approved</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>12</td>
                <td>John</td>
                <td>United States</td>
                <td>Female</td>
                <td>45</td>
                <td>20-05-2014</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-info">Pending</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>13</td>
                <td>Larry</td>
                <td>United States</td>
                <td>Female</td>
                <td>40</td>
                <td>21-09-1999</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-warning">Suspended</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>14</td>
                <td>Lahm</td>
                <td>Germany</td>
                <td>Female</td>
                <td>15</td>
                <td>20-05-2014</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-danger">Blocked</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>15</td>
                <td>Henry</td>
                <td>Japan</td>
                <td>Male</td>
                <td>32</td>
                <td>20-05-2014</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-success">Approved</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>16</td>
                <td>Henry</td>
                <td>United States</td>
                <td>Male</td>
                <td>32</td>
                <td>21-09-1999</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-success">Approved</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>17</td>
                <td>Melinda</td>
                <td>United States</td>
                <td>Female</td>
                <td>45</td>
                <td>20-05-2014</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-info">Pending</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>18</td>
                <td>Luan</td>
                <td>VietNam</td>
                <td>Male</td>
                <td>40</td>
                <td>21-09-1999</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-warning">Suspended</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>19</td>
                <td>Lahm</td>
                <td>United States</td>
                <td>Female</td>
                <td>15</td>
                <td>20-05-2014</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-danger">Blocked</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>20</td>
                <td>Henry</td>
                <td>France</td>
                <td>Male</td>
                <td>32</td>
                <td>21-09-1999</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-success">Approved</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>20</td>
                <td>Henry</td>
                <td>France</td>
                <td>Male</td>
                <td>32</td>
                <td>20-05-2014</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-success">Approved</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
              <tr>
                <td>20</td>
                <td>Jane</td>
                <td>England</td>
                <td>Male</td>
                <td>32</td>
                <td>21-09-2014</td>
                <td>$240.50</td>
                <td><span class="label label-sm label-success">Approved</span></td>
                <td><button type="button" class="btn btn-default btn-xs"><i class="fa fa-edit"></i>&nbsp;
                  Edit </button></td>
              </tr>
            </tbody>
          </table>
        </div>
      </div>
    </div>
  </div>
</div>